<script setup lang='ts'>
// 自定义 规则
//interface Props {
//}

import { onMounted, ref, defineEmits, defineProps } from "vue";
import Bottom from "@/components/Bottom/index.vue";
const emits = defineEmits(["click"]);
const props = defineProps({
  butText: {
    type: String,
    default: () => "确定",
  },
  fixed: {
    type: Boolean,
    default: () => true,
  },
  butStyle: {
    type: Object,
    default: () => { },
  },
  style: {
    type: Object,
    default: () => { },
  },
  isDisabled: {
    type: Boolean,
    default: () => false,
  }
});

/**
 * @property 变量
 */

/**
 * @property  所有请求以api开头 如:apiDataInfo
 * / 


/**
 * @property 自定义事件 以事件名开头 如: clickButton,inputDev
 */

/**
 * @property 内置方法
 */
</script>
<template>
  <div class="w-[100vw] pt-30rpx pb-30rpx bg-[#fff] pl-4.25 pr-4.25 fixed bottom-0 left-0" :style="{
    ...props.style,
    position: props.fixed ? 'fixed' : 'static',
  }">
   <slot name="top" />
  <div class="frb fra">
    <slot name="leftIcon" />
    <Bottom :text="props.butText" @click="emits('click')" :is-disabled="isDisabled" :style="{
      ...props.butStyle,
      width: props.butStyle?.width ? props.butStyle?.width : '328rpx',
      height: props.butStyle?.height ? props.butStyle?.height : '88rpx',
    }" />
  </div>
   
  </div>
</template>
<style lang="scss" scoped></style>